﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AppFormPreview.aspx.cs" Inherits="Easy.Web.Pages.EntityPages.AppFormPreview" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <link href="/_css/MuiCss/CSS/mui.min.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/mui.dtpicker.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/mui.extension.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/mui.indexedlist.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/mui.picker.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/mui.poppicker.css" rel="stylesheet" type="text/css" />
    <link href="/_css/MuiCss/CSS/iconfont.css" />

    <script src="/_js/MuiJs/mui.min.js"></script>
    <script src="/_js/MuiJs/mui.dtpicker.js"></script>
    <script src="/_js/MuiJs/mui.index.js"></script>
    <script src="/_js/MuiJs/mui.indexedlist.js"></script>
    <script src="/_js/MuiJs/mui.picker.js"></script>
    <script src="/_js/MuiJs/mui.poppicker.js"></script>
    <script src="/_js/MuiJs/mui.zoom.js"></script>
    <script src="/_js/MuiJs/mui.previewimage.js"></script>
    <script type="text/javascript">
        <%=coreScript %>
    </script>
    <script>/**
			 * 实体名称
			 */
        var entityName,
        /**
         * 编号
         */
        id,
        /**
         * 当前页面
         */
        currentWebview,
        entityField,
        entityOption,
        privilege,
        functionPrivilege,
        views = {},
        title;

        function initpage() {
            setScript();
            document.getElementById("edit").addEventListener("click", function () {
                title = document.getElementById("title").innerHTML;
                document.getElementById("title").innerHTML = "编辑";
                for (var key in objData) {
                    var elem = document.getElementsByName(key);
                    if (elem.length > 0) {
                        elem[0].disabled = false;
                        elem[0].style.color = "#000000";
                    }
                }
                this.style.display = "none";
                document.getElementById("saveChange").style.display = "block";
            });
            document.getElementById("saveChange").addEventListener("click", function () {
                var postData = setPostData();
                var errorMsg = validate(postData);
                if (!!errorMsg) {
                    mui.toast(errorMsg);
                }
                else {
                    currentWebview.evalJS(obj.JsBeforeSaveData);
                    setExcute(postData);
                    currentWebview.evalJS(obj.JsAfterSaveData);
                }
            });
        }
        /**
         * 页面初始化
         */
        var pageInit = function () {
            var objData = JSON.parse(obj.data);
            for (var key in objData) {
                var elem = document.getElementsByName(key);
                if (elem.length > 0) {
                    elem[0].disabled = true;
                    elem[0].style.color = "	#808080";
                }
            }
        };

        /**
         * 设置初始数值
         * @param data 数据
         */
        var setData = function (data) {
            if (!!data) {
                var objData = JSON.parse(obj.data);
                for (var key in objData) {
                    var elem = document.getElementsByName(key);
                    if (elem.length > 0) {
                        switch (elem[0].tagName) {
                            case "TEXTAREA":
                                elem[0].innerHTML = objData[key];
                                break;
                            case "INPUT":
                                if (!!entityOption[key]) {
                                    for (var index in entityOption[key]) {
                                        if (entityOption[key][index].value == objData[key]) {
                                            elem[0].value = entityOption[key][index].text;
                                            elem[0].setAttribute("pick_value", entityOption[key][index].value);
                                        }
                                    }
                                }
                                else {
                                    switch (typeof objData[key]) {
                                        case "object":
                                            elem[0].value = objData[key].Name;
                                            elem[0].setAttribute("lookup_id", objData[key].Id);
                                            elem[0].addEventListener("click", function () {
                                                mui.openWindow({
                                                    url: "lookup.html",
                                                    id: "tlm_id",
                                                    extras: {
                                                        "view": {
                                                            e: "tlm_lead",
                                                            v: "LookupView",
                                                            r: "form_lookup"
                                                        }
                                                    }
                                                });
                                            });
                                            break;
                                        default:
                                            elem[0].value = objData[key];
                                            break;
                                    }
                                }
                                break;
                        }
                    }
                }
            }
        };
        /**
         * 设置脚本
         */
        var setScript = function () {
            var setScript = function () {
                var inputs = document.querySelectorAll("div#content [name]");
                for (var key in inputs) {
                    var input = inputs[key];
                    var name = input.name;
                    var entity = entityField[name];
                    if (!entity || !input) continue;
                    switch (input.getAttribute("tl-type")) {
                        case "lookup":
                            input.style.readonly = "false";
                            break;
                        case "date":
                            input.style.readonly = "false";
                            input.addEventListener("click", function () {
                                setDate(this);
                            });
                            break;
                        case "datetime":
                            input.style.readonly = "false";
                            input.addEventListener("click", function () {
                                setDate(this);
                            });
                            break;
                        default:
                            break;
                    }
                }
                for (var key in entityOption) {
                    var inputs = document.getElementsByName(key);
                    if (inputs.length == 0) continue;
                    var input = inputs[0];
                    if (input.type == "text") {
                        input.pick = new mui.PopPicker();
                        input.pick.setData(entityOption[key]);
                        input.addEventListener("click", function () {
                            var item = this;
                            this.pick.show(function (items) {
                                item.value = items[0].text;
                                item.setAttribute("pick_value", items[0].value);
                            });
                        });
                    }
                }
                mui(".mui-switch")["switch"]();
                var switches = document.querySelectorAll(".mui-content .mui-switch");
                for (var index = 0; index < switches.length; index++) {
                    switches[index].addEventListener('toggle', function (event) {
                        //						mui(this).switch().toggle();
                        //						mui(this).switch().toggle
                        if (event.detail.isActive) {
                            console.log("你启动了开关");
                        } else {
                            console.log("你关闭了开关");
                        }
                    });
                }
            };
        };
        /**
         * 设置要上传的数据
         */
        var setPostData = function () {
            var postData = {};
            for (var key in entityField) {
                var inputs = document.getElementsByName(key);
                if (inputs.length > 0) {
                    var value,
                        input = inputs[0];
                    switch (input.tagName) {
                        case "TEXTAREA":
                            value = input.innerHTML;
                            break;
                        case "INPUT":
                            value = !!input.getAttribute("pick_value") ? input.getAttribute("pick_value")
                                        : input.value;
                            break;
                    }
                    postData[key] = value;
                }
            }
            return postData;
        };
        /**
         * 验证上传数据
         */
        var validate = function (data) {
            var result;
            for (var key in data) {
                var displayName = entityField[key]["DisplayName"];
                var type = entityField[key]["type"];
                var isNullable = entityField[key]["isNullable"];
                if (!isNullable && !data[key]) {
                    result = displayName + "为必填项";
                }
                switch (type) {
                    case "int":
                        break;
                    case "float":
                        break;
                }
            }
            return result;
        };
        /**
         * 设置保存事件
         */
        var setExcute = function (data) {
            var postData = {
                "entityname": entityName,
                "id": id,
                "data": JSON.stringify(data)
            };
            mui.ajax({
                url: TLM.ServiceUrl + "/Service/CommonOperation/SaveData.ashx",
                type: "post",
                data: postData,
                success: function (result) {
                    console.log(result);
                    var resultObj = JSON.parse(result);
                    mui.toast(resultObj.ResultMessage);
                    if (resultObj.ResultObj.ResultCode == 0) {
                        setTimeout(function () {
                            plus.webview.currentWebview().close();
                        }, 300);
                    }
                },
                error: function (error) {
                    //							for (var key in error){
                    //								console.log(key + ":" + error[key])
                    //							}
                }
            })
        };
        /**
         * 设置日期
         * @param elem 设置日期的html元素
         */
        var setDate = function (elem) {
            var dDate = new Date();
            dDate.setFullYear(dDate.getFullYear(), dDate.getMonth(), dDate.getDate());
            var minDate = new Date();
            minDate.setFullYear(2010, 0, 1);
            var maxDate = new Date();
            maxDate.setFullYear(2020, 12, 31);
            plus.nativeUI.pickDate(function (e) {
                var d = e.date;
                var strDate = d.getFullYear() + "-" + (parseInt(d.getMonth()) + 1) + "-" + d.getDate();
                elem.value = strDate;
            }, function (e) {
            }, {
                title: "请选择日期",
                date: dDate,
                minDate: minDate,
                maxDate: maxDate
            });
        }
        /**
         * 设置时间
         * @param elem 设置时间的html元素
         */
        var setDatetime = function (elem) {
            var dDate = new Date();
            dDate.setFullYear(dDate.getFullYear(), dDate.getMonth(), dDate.getDate());
            var minDate = new Date();
            minDate.setFullYear(2010, 0, 1);
            var maxDate = new Date();
            maxDate.setFullYear(2020, 12, 31);
            plus.nativeUI.pickDate(function (e) {
                var myDate = e.date;
                plus.nativeUI.pickTime(function (e) {
                    var d = e.date;
                    var minutes = d.getMinutes() == 0 ? "00" : d.getMinutes();
                    time = myDate.getFullYear() + "-" + (parseInt(myDate.getMonth()) + 1) + "-" + myDate.getDate() + " " + d.getHours() + ":" + minutes;
                    elem.value = time;
                }, function (e) {
                }, {
                    title: "请选择时间",
                    is24Hour: true,
                    time: dTime
                });
            }, function (e) {
            }, {
                title: "请选择日期",
                date: dDate,
                minDate: minDate,
                maxDate: maxDate
            });
        }
        var old_back = mui.back;
        mui.back = function () {
            var edit = document.getElementById("edit");
            var saveChange = document.getElementById("saveChange");
            if (edit.style.display == "block") {
                old_back();
            }
            else {
                document.getElementById("title").innerHTML = title;
                edit.style.display = "block";
                saveChange.style.display = "none";
                pageInit();
            }
        }</script>
    <script type="text/javascript">
        <%=UserScript %>

    </script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        .hid {
            display: inline-block !important;
            opacity: 0.3;
        }

        .isv-button {
            background-color: #555555;
            margin: 6px 10px;
        }

        .mui-bar-nav ~ .mui-content {
            padding-top: 35px;
        }

        .mui-slider .mui-slider-group .mui-slider-item img {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
        }

        .mui-android-4-1 .mui-slider .mui-slider-group .mui-slider-item img {
            width: 100%;
        }

        .mui-android-4-1 .mui-slider.mui-preview-image .mui-slider-group .mui-slider-item {
            display: inline-table;
        }

        .mui-android-4-1 .mui-slider.mui-preview-image .mui-zoom-scroller img {
            display: table-cell;
            vertical-align: middle;
        }

        .mui-preview-loading .mui-spinner-white {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-left: -25px;
            margin-top: -25px;
            height: 50px;
            width: 50px;
        }

        .header-button-right {
            float: right;
            color: #fff;
        }

        input, textarea {
            color: #8f8f94;
            opacity: 1;
        }

            input[type="text"],
            input[type="number"] {
                height: 27px;
                padding: 0;
            }

            input:disabled,
            textarea:disabled {
                color: #000000;
                opacity: 0.5;
            }

        .mui-btn {
            border-radius: 0;
            border: 0;
        }

        .mui-input-row label {
            padding: 0;
            line-height: 27px;
        }

        .mui-table-view-cell {
            width: 100%;
        }

            .mui-table-view-cell label {
                width: 30%;
                text-align: left;
                vertical-align: middle;
                padding-left: 0;
                padding-right: 0;
            }

            .mui-table-view-cell input {
                padding-left: 15px;
                width: 65%;
                text-align: left;
                vertical-align: middle;
            }

        .mui-table-view-chevron .mui-table-view-cell {
            padding-right: 5px;
        }

        @-webkit-keyframes fadeIn {
            0% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }

        @keyframes fadeIn {
            0% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }

        @-webkit-keyframes fadeOut {
            0% {
                opacity: 1;
            }

            100% {
                opacity: 0;
            }
        }

        @keyframes fadeOut {
            0% {
                opacity: 1;
            }

            100% {
                opacity: 0;
            }
        }

        p img {
            max-width: 100%;
            height: auto;
        }
    </style>
</head>
<body onload="initpage">
    <header class="mui-bar mui-bar-nav" style="background: #3a3a3a; height: 45px;">
        <a id="btn_back" style="display: none;" onclick="mui.back()">
            <span class="mui-icon mui-icon-back"></span>
        </a>
        <a class="header-button-right" style="padding-top: 10px;" id="btn_save">保存</a>
        <h1 id="title" class="mui-title" style="color: #FFF;"></h1>
    </header>
    <div id="content" class="mui-content">
        <%=UserHtml %>
    </div>
    <div id="AddAttachment" style="display: none; position: fixed; left: 0; top: 0; z-index: 999; height: 420px; width: 100%; height: 100%; background-color: #FFFFF3; padding: 10PX; text-align: center;">
        <input type="hidden" id="att_AttrachmentId_add" />
        <input type="hidden" id="att_attflag_add" />
        <img id="att_image_add" style="width: 100%; height: 200px" src="../img/logo.png" />
        <input id="att_name_add" type="text" placeholder="请输入名称" />
        <textarea id="att_desc_add" placeholder="请输入描述" style="padding: 0px"></textarea>
        <div style="margin: auto;">
            <button type="button" class="mui-btn mui-btn-green" onclick="SaveAttachmentRecord()">确定</button>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				<button type="button" class="mui-btn mui-btn-red" onclick="$('#AddAttachment').hide()">取消</button>
        </div>
    </div>
    <div id="AttachmentButtonList" class="mui-popover">
        <ul class="mui-table-view" style="color: blue;">
            <li class="mui-table-view-cell" onclick="ImageView(this)">
                <span class="mui-icon mui-icon-eye"></span>&nbsp;&nbsp;预览
            </li>
            <li class="mui-table-view-cell" onclick="EditAttachment(this)">
                <span class="mui-icon mui-icon-compose"></span>&nbsp;&nbsp;编辑
            </li>
            <li class="mui-table-view-cell" onclick="DelAttachment(this)" style="color: red;">
                <span class="mui-icon mui-icon-trash"></span>&nbsp;&nbsp;删除
            </li>
        </ul>
    </div>
</body>
</html>
